<template>
	<view>
		<view class="page">
			<comp-common v-bind="{data:data}" @getUserInfo="getUserInfo" @myLogin="myLogin" @getPhoneNumber="getPhoneNumber" @hideGetCoupon="hideGetCoupon" @closeCouponBox="closeCouponBox" @navigatorClick="navigatorClick"></comp-common>
			<comp-header v-bind="{data:data}" @relevanceError="relevanceError" @relevanceSuccess="relevanceSuccess"></comp-header>
			<view class="body">
        <view :class="['page', data.__page_classes]">
            <view class="body after-navber">
                <scroll-view class="scroll-view-x tab-bar" :scrollLeft="data.scrollLeft" scrollWithAnimation="true" scrollX="true" style="width:100%">
                    <view @tap="switchNav" :class="['tab-bar-item', data.status==-1?'active':'']" data-status="-1">
                        <text>全部</text>
                    </view>
                    <view @tap="switchNav" :class="['tab-bar-item', data.status==0?'active':'']" data-status="0">
                        <text>待付款</text>
                    </view>
                    <view @tap="switchNav" :class="['tab-bar-item', data.status==1?'active':'']" data-status="1">
                        <text>拼团中</text>
                    </view>
                    <view @tap="switchNav" :class="['tab-bar-item', data.status==2?'active':'']" data-status="2">
                        <text>拼团成功</text>
                    </view>
                    <view @tap="switchNav" :class="['tab-bar-item', data.status==3?'active':'']" data-status="3">
                        <text>拼团失败</text>
                    </view>
                    <view @tap="switchNav" :class="['tab-bar-item', data.status==4?'active':'']" data-status="4">
                        <text>售后</text>
                    </view>
                </scroll-view>
                <view class="order-list">
                    <view :@tap="data.status==4?'goToRefundDetail':''" class="order-itme" :data-refund_id="item.order_refund_id" v-for="(item,index) in data.order_list" :key="item.id">
                        <view style="background-color:#f7f7f7;height:20upx;"></view>
                        <view class="flex-row order-item-top flex-y-center" v-if="data.status!=4">
                            <view class="flex-grow-1 order-status">
                                {{item.status_name}}
                                <block v-if="item.is_group==1&&item.status==2">，还差{{item.surplusGruopNum}}人成团</block>
                            </view>
                            <view class="flex-grow-1 order-time" v-if="item.is_group==1&&item.status==2||item.status==1&&item.is_show_time">
                                剩{{item.limit_time.days}}天{{item.limit_time.hours}}小时{{item.limit_time.mins}}分{{item.limit_time.secs}}秒
                            </view>
                        </view>
                        <view class="flex-row order-item-top flex-y-center" v-if="data.status==4">
                            <view class="flex-grow-1 order-status">
                                订单号：{{item.order_no}}
                            </view>
                            <view class="flex-grow-1 order-time">
                                {{item.addtime}}
                            </view>
                        </view>
                        <view class="flex-row goods" v-for="(good,i) in item.goods_list" :key="i">
                            <view class="flex-grow-0 goods-image">
                                <image :src="good.goods_pic"></image>
                            </view>
                            <view class="flex-grow-1 flex-col">
                                <view class="flex-grow-1">
                                    <view class="goods-name">{{good.goods_name}}</view>
                                    <view class="attr-list flex-row">
                                        <block v-for="(attr,ii) in good.attr_list" :key="ii">
                                            {{attr.attr_group_name}}:{{attr.attr_name}}
                                        </block>
                                    </view>
                                </view>
                                <view class="flex-grow-0 flex-row order-price">
                                    <view class="flex-grow-1 num">×{{good.num}}</view>
                                    <view class="flex-grow-0 price">￥:{{good.price}}</view>
                                </view>
                            </view>
                        </view>
                        <view class="flex-row order-item-total flex-y-center">
                            <view class="flex-grow-1" v-if="data.status!=4">
                                合计：
                                <text>¥ {{item.total_price}}</text>
                            </view>
                            <view class="flex-grow-1" style="text-align:left;" v-if="item.refund_status==0">
                                <block v-if="item.refund_type==1">
                                    <block v-if="item.is_agree==0">等待处理</block>
                                    <block v-else>
                                        <block v-if="item.is_user_send==0">待买家发货</block>
                                        <block v-else>等卖家待处理</block>
                                    </block>
                                </block>
                                <block v-else>等卖家待处理</block>
                            </view>
                            <view class="flex-grow-1" style="text-align:left;" v-if="data.status==4&&item.refund_status==1">
                                同意已退款
                            </view>
                            <view class="flex-grow-1" style="text-align:left;" v-if="data.status==4&&item.refund_status==2">
                                已同意换货
                            </view>
                            <view class="flex-grow-1" style="text-align:left;" v-if="data.status==4&&item.refund_status==3">
                                已拒绝退换货
                            </view>
                            <view class="flex-grow-1" v-if="data.status==4&&item.refund_type==1">
                                退货退款：
                                <text>¥ {{item.refund_price}}</text>
                            </view>
                            <view class="flex-grow-1" v-if="data.status==4&&item.refund_type==2">
                                换货
                            </view>
                        </view>
                        <view class="play-btn flex-row flex-y-center" v-if="data.status!=4">
                            <text v-if="item.apply_delete==1&&status==0">取消申请中</text>
                            <view @tap="goToCancel" class=" frame-btn flex-gorw-0 flex-y-center" :data-id="item.order_id" v-if="item.apply_delete==0&&item.is_cancel==0&&item.status==0&&item.status!=4&&item.is_send==0">
                                取消
                            </view>
                            <view @tap="getOfflineQrcode" class=" red-btn flex-gorw-0 flex-y-center" :data-id="item.order_no" v-if="item.offline==2&&item.is_confirm==0&&item.status==3&&item.apply_delete==0">
                                核销码
                            </view>
                            <view @tap="orderPay" class=" red-btn flex-gorw-0 flex-y-center" :data-id="item.order_id" :data-index="index" v-if="item.status==1&&item.is_cancel==0">
                                去支付
                            </view>
                            <navigator class="flex-gorw-0 frame-btn" openType="navigate" :url="'/pages/pt/order-details/order-details?id='+item.order_id" v-if="item.status==2||item.status==3||item.status==4">
                                订单详情
                            </navigator>
                            <button @tap="goToGroup" class="flex-gorw-0 red-btn" :data-id="item.order_id" v-if="(item.status==2||item.status==3||item.status==4)&&item.is_group==1">
                                拼团详情
                            </button>
                            <navigator class="order-option-btn frame-btn" :url="'/pages/pt/order-comment/order-comment?id='+item.order_id" v-if="item.is_send==1&&item.is_confirm==1&&item.is_comment==0">评价
                            </navigator>
                        </view>
                    </view>
                </view>
                <view class="empty-order" v-if="data.show_no_data_tip">
                    <view style="background-color:#f7f7f7;height:20upx;"></view>
                    <view class="empty-img flex-x-center">
                        <image :src="data.__wxapp_img.pt.empty_order.url"></image>
                    </view>
                    <view class="empty-text flex-x-center">
                        还没有相关拼团订单哦
                    </view>
                    <view class="empty-btn flex-x-center">
                        <view @tap="goHome" class="go-to-group flex-x-center flex-y-center">
                            去开团
                        </view>
                    </view>
                </view>
                <view @tap="hide" :class="['flex-row flex-y-center modal', data.hide==1?'hide':'']">
                    <view class="flex-y-center" style="width:100%;height:800upx;padding:100upx;">
                        <view style="background-color:#fff;width:100%;height:100%;border-radius:10upx;padding:0 50upx;">
                            <view class="flex-x-center" style="width:100%;height:50upx;margin-top:50upx;font-size:13pt;margin-bottom:20upx">核销二维码</view>
                            <image :src="data.qrcode" style="width:450upx;height:450upx;"></image>
                        </view>
                    </view>
                </view>
            </view>
        </view>
    </view>
			<comp-footer v-bind="{data:data}"></comp-footer>
		</view>
	</view>
</template>

<script>var myVue = {};
	var t = !1, e = !1, a = 2;
	export default {
		data() {
			return {
				data: {
        hide: 1,
        qrcode: "",
        scrollLeft: 0,
        scrollTop: 0
    },
			};
		},
		onLoad: function(o) {myVue = this;
        myVue.getApp.page.onLoad(this, o), this.systemInfo = myVue.getApp.core.getSystemInfoSync();
        var r = myVue.getApp.core.getStorageSync(myVue.getApp.const.DAPP);
        this.setData({
            dapp: r
        });
        var i = this;
        t = !1, e = !1, a = 2, i.loadOrderList(o.status || -1);
        var n = 0;
        n = o.status >= 2 ? 600 : 0, i.setData({
            scrollLeft: n
        });
    },
    onReady: function(t) {
        myVue.getApp.page.onReady(this);
    },
    onShow: function(t) {
        myVue.getApp.page.onShow(this);
    },
    onHide: function(t) {
        myVue.getApp.page.onHide(this);
    },
    onUnload: function(t) {
        myVue.getApp.page.onUnload(this);
    },
    onPullDownRefresh: function(t) {
        myVue.getApp.page.onPullDownRefresh(this);
    },
		onReachBottom: function(o) {
        myVue.getApp.page.onReachBottom(this);
        var r = this;
        e || t || (e = !0, myVue.getApp.request({
            url: myVue.getApp.api.group.order.list,
            data: {
                status: r.data.status,
                page: a
            },
            success: function(e) {
                if (0 == e.code) {
                    var o = r.data.order_list.concat(e.data.list);
                    r.setData({
                        order_list: o
                    }), 0 == e.data.list.length && (t = !0);
                }
                a++;
            },
            complete: function() {
                e = !1;
            }
        }));
    },
		methods: {
			loadOrderList: function(t) {
        void 0 == t && (t = -1);
        var e = this;
        e.setData({
            status: t
        }), myVue.getApp.core.showLoading({
            title: "正在加载",
            mask: !0
        }), myVue.getApp.request({
            url: myVue.getApp.api.group.order.list,
            data: {
                status: e.data.status
            },
            success: function(a) {
                0 == a.code && e.setData({
                    order_list: a.data.list
                }), e.setData({
                    show_no_data_tip: 0 == a.data.list.length
                }), 4 != t && e.countDown();
            },
            complete: function() {
                e.getApp.core.hideLoading();
            }
        });
    },
    countDown: function() {
        var t = this;
        setInterval(function() {
            var e = t.data.order_list;
            for (var a in e) {
                var o = new Date(e[a].limit_time_ms[0], e[a].limit_time_ms[1] - 1, e[a].limit_time_ms[2], e[a].limit_time_ms[3], e[a].limit_time_ms[4], e[a].limit_time_ms[5]) - new Date(), r = parseInt(o / 1e3 / 60 / 60 / 24, 10), i = parseInt(o / 1e3 / 60 / 60 % 24, 10), n = parseInt(o / 1e3 / 60 % 60, 10), s = parseInt(o / 1e3 % 60, 10);
                r = t.checkTime(r), i = t.checkTime(i), n = t.checkTime(n), s = t.checkTime(s), 
                e[a].limit_time = {
                    days: r,
                    hours: i > 0 ? i : "00",
                    mins: n > 0 ? n : "00",
                    secs: s > 0 ? s : "00"
                }, t.setData({
                    order_list: e
                });
            }
        }, 1e3);
    },
    checkTime: function(t) {
        return (t = t > 0 ? t : 0) < 10 && (t = "0" + t), t;
    },
		goHome: function(t) {
        myVue.getApp.core.redirectTo({
            url: "/pages/pt/index/index"
        });
    },
    orderPay_1: function(t) {
			var _this = this;
        myVue.getApp.core.showLoading({
            title: "正在提交",
            mask: !0
        }), myVue.getApp.request({
            url: myVue.getApp.api.group.pay_data,
            data: {
                order_id: t.currentTarget.dataset.id,
                pay_type: "WECHAT_PAY"
            },
            complete: function() {
                myVue.getApp.core.hideLoading();
            },
            success: function(t) {
                0 == t.code && myVue.getApp.core.requestPayment({
                    _res: t,
                    timeStamp: t.data.timeStamp,
                    nonceStr: t.data.nonceStr,
                    package: t.data.package,
                    signType: t.data.signType,
                    paySign: t.data.paySign,
                    success: function(t) {},
                    fail: function(t) {},
                    complete: function(t) {
                        "requestPayment:fail" != t.errMsg && "requestPayment:fail cancel" != t.errMsg ? myVue.getApp.core.redirectTo({
                            url: "/pages/pt/order/order?status=1"
                        }) : myVue.getApp.core.showModal({
                            title: "提示",
                            content: "订单尚未支付",
                            showCancel: !1,
                            confirmText: "确认",
                            success: function(t) {
                                t.confirm && myVue.getApp.core.redirectTo({
                                    url: "/pages/pt/order/order?status=0"
                                });
                            }
                        });
                    }
                }), 1 == t.code && myVue.getApp.core.showToast({
                    title: t.msg,
                    image: "/static/images/icon-warning.png"
                });
            }
        });
    },
    goToGroup: function(t) {
        myVue.getApp.core.navigateTo({
            url: "/pages/pt/group/details?oid=" + t.target.dataset.id
        });
    },
    getOfflineQrcode: function(t) {
        var e = this;
        myVue.getApp.core.showLoading({
            title: "正在加载",
            mask: !0
        }), myVue.getApp.request({
            url: myVue.getApp.api.group.order.get_qrcode,
            data: {
                order_no: t.currentTarget.dataset.id
            },
            success: function(t) {
                0 == t.code ? e.setData({
                    hide: 0,
                    qrcode: t.data.url
                }) : e.getApp.core.showModal({
                    title: "提示",
                    content: t.msg
                });
            },
            complete: function() {
                e.getApp.core.hideLoading();
            }
        });
    },
    hide: function(t) {
        this.setData({
            hide: 1
        });
    },
    goToCancel: function(t) {
        var e = this;
        myVue.getApp.core.showModal({
            title: "提示",
            content: "是否取消该订单？",
            cancelText: "否",
            confirmText: "是",
            success: function(a) {
                if (a.cancel) return !0;
                a.confirm && (myVue.getApp.core.showLoading({
                    title: "操作中"
                }), myVue.getApp.request({
                    url: myVue.getApp.api.group.order.revoke,
                    data: {
                        order_id: t.currentTarget.dataset.id
                    },
                    success: function(t) {
                        e.getApp.core.hideLoading(), e.getApp.core.showModal({
                            title: "提示",
                            content: t.msg,
                            showCancel: !1,
                            success: function(t) {
                                t.confirm && e.loadOrderList(e.data.status);
                            }
                        });
                    }
                }));
            }
        });
    },
    switchNav: function(t) {
        var e = t.currentTarget.dataset.status;
        myVue.getApp.core.redirectTo({
            url: "/pages/pt/order/order?status=" + e
        });
    },
    goToRefundDetail: function(t) {
        var e = t.currentTarget.dataset.refund_id;
        myVue.getApp.core.navigateTo({
            url: "/pages/pt/order-refund-detail/order-refund-detail?id=" + e
        });
    }
		},
	}
</script>

<style scoped>
page {
    background-color: #ffffff;
}

.scroll-view-x {
    background-color: #fff;
    white-space: nowrap;
    position: fixed;
    top: var(--window-top);
    border-top: 1upx solid #e2e2e2;
    height: 100upx;
}

.tab-bar {
    background: #fff;
    border-bottom: 1upx solid #e2e2e2;
    z-index: 1000;
    font-size: 11pt;
    color: #666666;
}

.tab-bar~.order-list {
    padding-top: 100upx;
}

.order-itme {
    border-bottom: 1upx solid #f7f7f7;
}

.tab-bar .tab-bar-item {
    display: inline-block;
    padding: 0 24upx;
    text-align: center;
}

.tab-bar-item {
    display: inline-block;
}

.tab-bar .tab-bar-item text {
    height: 98upx;
    line-height: 100upx;
    display: inline-block;
}

.tab-bar .tab-bar-item.active text {
    color: #ff5c5c;
    border-bottom: 2upx solid #f00;
}

.goods-image image {
    width: 156upx;
    height: 156upx;
    margin-right: 24upx;
}

.order-item-top {
    height: 80upx;
    color: #ff5c5c;
    font-size: 10pt;
    border-bottom: 1upx solid #f7f7f7;
    background-color: #ffffff;
    padding: 0 24upx;
}

.order-time {
    text-align: right;
    color: #919191;
}

.goods {
    padding: 24upx;
    color: #353535;
    border-bottom: 1upx solid #f7f7f7;
    background-color: #ffffff;
}

.goods-name {
    font-size: 12pt;
    line-height: 1;
}

.attr-list {
    margin-top: 20upx;
    margin-bottom: 18upx;
    font-size: 9pt;
    line-height: 1;
}

.order-price {
    font-size: 12pt;
}

.order-item-total {
    text-align: right;
    color: #353535;
    font-size: 12pt;
    height: 80upx;
    border-bottom: 1upx solid #f7f7f7;
    padding: 0 24upx;
    background-color: #ffffff;
}

.order-item-total text {
    color: #ff5c5c;
}

.play-btn {
    text-align: right;
    padding: 15upx 24upx;
    background-color: #ffffff;
    justify-content: flex-end;
}

.red-btn {
    width: 200upx;
    height: 65upx;
    background-color: #ff5c5c;
    display: inline-block;
    text-align: center;
    line-height: 65upx;
    border-radius: 10upx;
    color: #ffffff;
    font-size: 9pt;
    padding: 0!important;
    margin: 0 0 0 24upx!important;
    border: 0!important;
}

.frame-btn {
    font-size: 9pt;
    margin-left: 20upx;
    width: 200upx;
    height: 65upx;
    display: inline-block;
    text-align: center;
    line-height: 65upx;
    border-radius: 10upx;
    border: 1upx solid #c9c9c9;
    color: #666666;
}

.empty-img image {
    width: 280upx;
    height: 280upx;
}

.empty-img {
    margin-top: 134upx;
}

.empty-text {
    margin-top: 56upx;
    font-size: 12pt;
    color: #666666;
}

.empty-btn {
    margin-top: 30upx;
}

.go-to-group {
    height: 64upx;
    width: 220upx;
    color: #ffffff;
    font-size: 11pt;
    background-color: #ff5c5c;
    border-radius: 5upx;
}

.hide {
    display: none;
}

.modal {
    position: fixed;
    top: var(--window-top);
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    z-index: 9999;
}
</style>
